﻿@page "/Checkbox"

@using FluentUI.Demo.Shared.Pages.Checkbox.Examples

<PageTitle>@App.PageTitle("Checkbox")</PageTitle>

<h1>Checkbox</h1>

<p>An implementation of a <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/Input/checkbox" target="_blank" rel="noopener noreferrer">checkbox</a> web-component.</p>
<p>
    <code>&lt;FluentCheckbox&gt;</code> wraps the <code>&lt;fluent-checkbox&gt;</code> element, a web component implementation of a<a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/Input/checkbox" target="_blank" rel="noopener noreferrer">checkbox</a>, leveraging the Fluent UI design system.
</p>

<h2 id="example">Examples</h2>

<DemoSection Title="Default checkbox examples" Component="@typeof(CheckboxDefault)"></DemoSection>

<DemoSection Title="Three States" Component="@typeof(CheckboxThreeState)"></DemoSection>

<DemoSection Title="Three States List" Component="@typeof(CheckboxThreeStateList)"></DemoSection>

<h2 id="documentation">Documentation</h2>

<ApiDocumentation Component="typeof(FluentCheckbox)" GenericLabel="bool"/>
